<template>
  <div class="config-dialog">
    <tool-dialog top="7vh" v-model="show" :title="title">
      <tool-form :model="uploadForm" ref="form">
        <tool-form-item label="自定义名称">
          <tool-input v-model="uploadForm.configName"></tool-input>
        </tool-form-item>
        <tool-form-item label="本地项目路径">
          <tool-input v-model="uploadForm.buildPath"></tool-input>
        </tool-form-item>
        <tool-form-item label="打包子路径">
          <tool-input v-model="uploadForm.buildChild"></tool-input>
        </tool-form-item>
        <tool-form-item label="服务器地址">
          <tool-input v-model="uploadForm.remoteAddress"></tool-input>
        </tool-form-item>
        <tool-form-item label="用户名">
          <tool-input v-model="uploadForm.username"></tool-input>
        </tool-form-item>
        <tool-form-item label="密码">
          <tool-input v-model="uploadForm.password"></tool-input>
        </tool-form-item>
        <!-- <tool-form-item label="web服务器类型">
          <tool-select v-model="uploadForm.webServerType" :options="webTypeList"></tool-select>
        </tool-form-item> -->
        <tool-form-item label="web服务器路径">
          <tool-input v-model="uploadForm.webServerPath"></tool-input>
        </tool-form-item>
        <tool-form-item>
          <tool-button type="primary" @click="saveConfig">保存</tool-button>
          <tool-button type="default" @click="cancel">取消</tool-button>
        </tool-form-item>
      </tool-form>
    </tool-dialog>
  </div>
</template>

<script>
export default {
  props: {
    value: {
      type: Boolean,
      default: false
    },
    // 对话框标题
    title: {
      type: String,
      default: ''
    },
    // 提交的表单
    uploadForm: {
      type: Object,
      default: () => {
        return {
          configName: '',
          buildPath: '',
          buildChild: '',
          remoteAddress: '',
          username: '',
          password: '',
          webServerType: '',
          webServerPath: ''
        }
      }
    }
  },
  computed: {
    show: {
      get () {
        return this.value
      },
      set (val) {
        this.$emit('input', val)
      }
    }
  },
  data () {
    return {
      webTypeList: [
        { value: 'Tomcat', label: 'Tomcat' },
        { value: 'Nginx', label: 'Nginx' }
      ]
    }
  },
  methods: {
    // 保存配置
    async saveConfig () {
      const haveRecord = await this.haveRecord()
      if (haveRecord) {
        // 更新记录
        this.$db.buildconfig.update({ _id: this.uploadForm._id }, this.uploadForm, {}, (err, res) => {
          if (err) {
            return
          }
          this.show = false
          this.$emit('save')
        })
      } else {
        // 插入数据
        this.$db.buildconfig.insert(this.uploadForm, (err, res) => {
          if (err) {
            return
          }
          this.show = false
          this.$emit('save')
        })
      }
    },
    // 查找当前数据有无记录
    haveRecord () {
      return new Promise((resolve, reject) => {
        this.$db.buildconfig.findOne({ _id: this.uploadForm._id }, (err, res) => {
          if (err) {
            return reject(err)
          }
          if (res) {
            resolve(true)
          } else {
            resolve(false)
          }
        })
      })
    },
    // 取消
    cancel () {
      this.show = false
    },
    // 重置表单内容
    resetForm () {
      this.$refs.form.resetForm()
    }
  }
}
</script>

<style>

</style>